<template>
	<view>
		<view class="body after-navber">
		                        <view class="goods-list flex">
		                            <!-- <navigator
		                                class="goods-item"
		                                openType="navigate"
		                                :url="'/pages2/shop/goods-detail/goods-detail?id=' + item.id"
		                                v-for="(item, index) in list"
		                                :key="item.id"
		                            > -->
									<navigator
									    class="goods-item"
									    openType="navigate"
									    v-for="(item, index) in list"
									    :key="item.id"
									    :url="item.type==1?'/pages2/integral-mall/goods-info/goods-info?id=' + item.product.id:'/pages2/shop/goods-detail2/goods-detail2?id=' + item.product.id"
									>
		                                <image class="goods-pic" mode="aspectFill" :src="item.product.image"></image>
		
		                                <view class="goods-info">
		                                    <text class="goods-name">{{ item.product.name }}</text>
		                                    <text class="goods-price"  v-if="item.product.is_score_buy == 0">
		                                        <block>￥</block>
		                                        {{ item.product.price }}
		                                    </text>
											<text class="goods-price"  v-else>
											 
											    {{ item.product.score }}   <block>{{money_name}}</block>
											</text>
		                                </view>
		                            </navigator>
		                        </view>
		                        <view class="no-content" v-if="goods.list.length == 0">暂无收藏的商品</view>
		                        <view class="no-content" v-if="goods.list.length > 0 && !has_more" style="color: #999;text-align: center;margin: 15rpx;">没有更多了~</view>
		        </view>
		    </view>
		</view>
	</view>
</template>

<script>
	import {My} from '../../../apirequest/my-model.js';
	var m = new My();
	export default {
		data() {
			return {
					list:[],
					page:1,
					has_more:true,
					money_name:this.globalData.money_name,
			}
		},
		onLoad() {
		},
		onShow(){
			this.page=1;
			this.list=[];
			this.has_more=true;
			this._getList()
		},
		onReachBottom() {
			this._getList()
		},
		methods: {
			_getList(){
				var that = this;
				var page = this.page
				if(!this.has_more){
					return false;
				}
				m.get_collect_list({page:page},(res) => {
					if(res.code == 1){
						that.list = that.list.concat(res.data.data)
						that.page = page+1
						that.has_more = res.data.has_more
					}else{
						uni.showToast({
							title:res.msg,
							icon:'none'
						})
					}
				})
			},
		}
	}
</script>

<style>
.goods-list {
    padding-top: 5rpx;
	flex-wrap: wrap;
}

.goods-item {
    width: 365rpx;
    display: inline-block;
    position: relative;
    margin: 0 5rpx;
    margin-bottom: 10rpx;
    font-size: 0;
    background: #fff;
}

.goods-item .goods-pic {
    width: 100%;
    height: 365rpx;
}

.goods-item .goods-info {
    padding: 5rpx 0;
}

.goods-item .goods-name {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding: 10rpx;
    font-size: 11pt;
    display: block;
    text-align: center;
}

.goods-item .goods-price {
    font-size: 11pt;
    color: #f40;
    display: block;
    text-align: center;
}

.loading-bar {
    visibility: hidden;
}

.loading-bar.active {
    visibility: visible;
}

.tab-bar {
    background: #fff;
    border-top: 1rpx solid #e3e3e3;
    border-bottom: 1rpx solid #e3e3e3;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10;
    height: 100rpx;
}

.tab-bar .tab-name {
    display: inline-block;
    padding: 24rpx 32rpx;
    border-bottom: 2rpx solid transparent;
    height: 98rpx;
}

.tab-bar .tab-name.active {
    border-color: #ff4544;
    color: #ff4544;
}

.no-content {
    color: #888;
    padding: 100rpx 0 0 0;
    text-align: center;
}

.loading-more {
    text-align: center;
    opacity: 0;
}

.loading-more.active {
    opacity: 1;
}

.loading-more image {
    width: 160rpx;
    height: 80rpx;
}
</style>
